<html>
  <title>waveHighlight Robot V{{version}}</title>
  <style type="text/css">
  <!--
    body{
	    margin-left: 20px;
	    font-family: Verdana, "Times New Roman", Times, serif;
	}
	
	h1, h2, h3, {
	    margin-bottom: 0;
	    font-family: Verdana, "Times New Roman", Times, serif;
	    font-weight: bold;
	}
  -->
  </style>
  {{css}}
  <body>
    <h1>I'm waveHighlight Robot V{{version}}</h1>
    <h2>Usage</h2>
    <pre style="">
    1. add wavehighlight@appspot.com to your wave contacts.
    2. add the robot to the wave what you want to highlight code.
    3. input code segment in wave with following format:
	    [code lang='lang' style='style']
	    code here...
	    [/code] 
    4. Done. waveHighlight will highlight the code segment covered by [code]...[/code]
    </pre>
    <h2>Samples</h2>
    <pre>
    [code lang='python' style='default']
    def OnBlipSubmitted(properties, context):
        """Invoked everytime a blip is submitted"""
        blip = context.GetBlipById(properties['blipId']).GetDocument()
        highlightBlip(blip)
    [/code] 
    </pre>
    <h2>Supported Language/Styles</h2>
    <h3>Styles:</h3> 
    {%for style in styles %} {{style}},&nbsp;&nbsp;{% endfor %}
    <h3>languages:</h3> 
    {%for lang in languages %} {{lang}},&nbsp;&nbsp;{% endfor %}
    <h2>Demo:</h2>
    <div style="width:100%;">
        {{newcontent}}
        </div>
    <div>
    (do not need [code]...[/code])
    <form action="/" method="post">
            <div>language:  
            <select name="lang">
            {% for lang in languages %}
            <option {%ifequal curlang lang %}selected="selected"{%endifequal%} value="{{lang}}">{{lang}}</option>
            {% endfor %}
            </select>
            styles:  
            <select name="style">
            {% for style in styles %}
            <option {%ifequal curstyle style %}selected="selected"{%endifequal%} value="{{style}}">{{style}}</option>
            {% endfor %}
            </select>
            <input type="submit" value="submit"/>
            </div>
            <div><textarea style="width:90%" rows="16" id="source" name="source">{{content|escape}}</textarea></div>
    </form>
    </div>
  </body>
</html>